<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
	String bathPath = request.getContextPath();
	pageContext.setAttribute("bathPath", bathPath);
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <meta charset="utf-8">
  <title>XXX</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <script type="text/javascript" src="${bathPath}/js/jquery-1.9.1.min.js" ></script>
  <link rel="stylesheet" href="${bathPath}/frame/layui/css/layui.css"  media="all">
  <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<style type="text/css"> 
.layui-table-cell .layui-form-checkbox[lay-skin="primary"]{
     top: 50%;
     transform: translateY(-50%);
}
</style>

<body>
<form id="myform">
 <input type="hidden" id="groupID" name="groupID" value="${prowerGroup.groupID}">
 <div class="demoTable" style="margin-top: 15px;margin-left: 20px;">
</div> 
</form>   
 <!-- <table class="layui-hide"  id="demo"></table> -->
 
	<table class="layui-hide"  id="test1"  lay-filter="test1">
	</table>

 
<script src="${bathPath}/frame/layui/layui.js" charset="utf-8"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 --> 
<script type="text/html" id="toolbarDemo">
	<div class="layui-btn-container">
    <span class="layui-btn layui-btn-sm" lay-event="quanxuan">全选</span>
    <span class="layui-btn layui-btn-sm" lay-event="quanqing">全清</span>
    <span class="layui-btn layui-btn-sm" lay-event="save">保存</span>

  </div>
</script>

<script>
var ckData = new Array();
var ckData1 = new Array();//存放userid的值(全选)
var ckData2 = new Array();//存放userid的值(单选)
Array.prototype.indexOf = function (val) {
    for (var i = 0; i < this.length; i++) {
        if (this[i] == val) return i;
    }
    return -1;
};

Array.prototype.remove = function (val) {
    var index = this.indexOf(val);
    if (index > -1) {
        this.splice(index, 1);
    }
};

var test1Table = new Array();

//表格事件
layui.use('table', function(){ 
	var parm = $('#myform').serialize(); //获取表单所有数据
	//$ = layui.jquery;
	var table = layui.table;
	//var form = layui.form ,layer = layui.layer;
  var layTableId="test1";
  var flag=0; //判断表格是否在增加数据
//返回data数据给表格
 var laydata="";
  function getdata(parm){
 	 //alert(111);
 	 $.ajax({
 			type:"POST",
 			data:parm,
 			async:false,  //默认true,异步
 			url:"${bathPath}/aDKUserInfo/selectAllu.action",
 			success:function(data){
 					laydata=data;
 		    }
 		});  
 	 return laydata;
  }
 



 
//console.log(laydata);

   //监听行工具栏事件
  	table.on('tool(test1)', function(obj){
  		var data = obj.data; //获得当前行数据
  		//alert(data)
  		//var classesId = data.classesId;
  		
  	    layEvent = obj.event; //获得 lay-event 对应的值
  	    if(layEvent === 'add'){
  	     window.open("${bathPath}/apply/xianshi.action?classId="+classesId);
  	    } 
  });
  //搜索事件
  function selectall()
  {
	  var parm1 = $('#myform').serialize(); //获取表单所有数据
  	//这里以搜索为例
  	table.reload('test',{
  		data:getdata(parm1),  //返回查询后的data直接赋值
  	    page: {
  	    curr: 1 //重新从第 1 页开始
  	  }
  	});
  	}
  //
  
 <%--  <% List<Object> list=new ArrayList(Object); %> --%>
  table.on('checkbox(test1)', function(obj){
	  console.log(obj.checked); //当前是否选中状态
	  console.log(obj); 
	  //单个选取
	  console.log(obj.data); //选中行的相关数据
	  var cdata=obj.data;
	  var data1=obj.data.userid;
	  console.log(data1);
	  if(obj.checked==true){
     	 ckData1.push(data1);
	  }else{
		  ckData1.remove(data1);
		  //ckData1.remove(obj.data);
	  } 
	  console.log(ckData1);
	  //console.log(obj.type);
	  
	  //如果触发的是全选，则为：all，如果触发的是单选，则为：one
	});
  
//监听头工具栏事件
	table.on('toolbar(test1)', function(obj){
  var checkStatus = table.checkStatus(obj.config.id)
  ,data = checkStatus.data; //获取选中的数据
  switch(obj.event){
  case 'quanxuan':   //全选
	  $(".layui-unselect.layui-form-checkbox").addClass("layui-form-checked");
      //获取所有的数据
     var all = table.cache.test1;//获取test1所有数据
     //console.log(table);
     for(var i = 0 ; i < all.length ; i++){
    	 if(ckData.indexOf(all[i])<0){    		 
    		 ckData.push(all[i]);
    	 }
     }
     console.log(all.length);
     for(var i = 0 ; i < all.length ; i++){
    	 ckData1[i]=ckData[i].userid;
    	 //console.log(ckData1);
     } 
     console.log(ckData);
     console.log("----------------");
     console.log(ckData1);
  break;
  case 'quanqing':   //全清
	  $(".layui-unselect.layui-form-checkbox").removeClass("layui-form-checked");
 	 var all = table.cache.test1;
 	 //清除所有数据
 	 for(var i = 0 ; i < all.length ; i++){
     	 ckData.remove(all[i]);
      }
 	 
      console.log(ckData);
  break;
    case 'save':   //保存
  	  //console.log(ckData1);
        //alert(ckData);
		$.ajax({
			 type:"POST",
			 async:false,
			 dataType:"text",
			 //data:param,
			url:"${bathPath}/aDKUserGroup/addUserPGroup.action?groupID="+$("#groupID").val()+"&ckData1="+JSON.stringify(ckData1),
		     success:function(data){
					layer.confirm("保存成功！", {btn: ['确定'], title: "提示",skin:"my-skin"}, function(){
						layer.close(layer.index);
						parent.location.reload(); 
					});
		     }
		 });
     
    break;
case 'quxiao':   //取消
	var index1 = parent.layer.getFrameIndex(window.name);  
  parent.layer.close(index1);//关闭当前页 
   break;
};
});



//监听排序
  table.on('sort(test1)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
  console.log(obj.field); //当前排序的字段名
  console.log(obj.type); //当前排序类型：desc（降序）、asc（升序）、null（空对象，默认排序）
  console.log(this); //当前排序的 th 对象
  parm="sort="+obj.field+"&order="+ obj.type;
  alert(parm);
  table.reload('test1', {
    initSort: obj //记录初始排序，如果不设的话，将无法标记表头的排序状态。 layui 2.1.1 新增参数
    ,data:getdata(parm)
  });
}); 

  //渲染表格
		 
			  table.render({
				  elem: '#test1'
					    ,id: layTableId
					   //,url:'${bathPath}/aDKUserInfo/selectAllu.action?groupID='+$("#groupID").val()
					 	,data:getdata(parm)
					    ,toolbar: '#toolbarDemo' 
					    ,cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
					    ,width:740
					    ,size:'sm'//小表格
					    ,cols: [[
					    	 {type: 'checkbox', fixed: 'left',align:'center',width:'15%'}
							,{type: 'numbers',title:'序号', fixed: 'left',align:'center',width:'10%'}
					      	,{field: 'depName',title:'所在部门', fixed: 'left',align:'center',width:'20%'}
					      	,{field: 'userid',title:'人员编号', fixed: 'left',align:'center',width:'20%'}
					      	,{field: 'username',title:'人员名称', fixed: 'left',align:'center',width:'25%'}
					    ]]
				    ,page: true //开启分页
				    ,limit:10   //默认十条数据一页
			        ,limits:[10,20,30,40,100]  //数据分页条
				  }); 
    		

			  

		  
            });
  
           
</script>

</body>
</html>